<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>axiosBasicApply</title>
</head>
<!-- get的参数是通过一个？来拼接的，post的参数是用一个对象来表述并且和地址用","隔开 -->

<body>
    <input class="get" type="button" value="get请求">
    <input class="post" type="button" value="post请求">
</body>
<script src="https://unpkg.com/axios/dist/axios.min.js">
    //需要导入专门的axios包
</script>
<script>
    // 接口1：随机笑话
    // 请求地址：   https://autumnfish.cn/api/joke/list
    // 请求接口：get
    // 请求参数：num（笑话条数，数字 ）
    // 响应内容：随机笑话
    document.querySelector(".get").onclick = function() {
            axios.get("https://autumnfish.cn/api/joke/list?num=6").then(function(response) {
                console.log(response);
            }, function(err) {
                console.log(err);
            })
        }
        // 接口2:用户注册
        // 请求地址：https://autumnfish.cn/api/user/reg
        // 请求接口：post
        // 请求参数：username（用户名，字符串 ）
        // 响应内容：注册成功与失败
    document.querySelector(".post").onclick = function() {
        axios.post("https://autumnfish.cn/api/user/reg", {
            username: "jack"
        }).then(function(response) {
                console.log(response);
            },
            function(err) {
                console.log(err);
            }
        )
    }
</script>

</html>